<template>
  <a-card :bordered="false">
    <div class="table-page-search-wrapper" v-if="showSearch==true">
      <a-form layout="inline">
        <a-row :gutter="48">
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.entityID','实体ID')">
                        <a-input :placeholder="i18n('form.entityID','实体ID','input')" v-model="queryParam.Q_ENT_ID__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="$ti18('rxForm.name', '名称')">
                        <a-input :placeholder="$ti18('rxForm.name', '名称','','input')" v-model="queryParam.Q_NAME__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="$comi18('business.fieldName', '字段名称')">
                        <a-input :placeholder="$comi18('business.fieldName', '字段名称','input')" v-model="queryParam.Q_FIELD_NAME__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="$ti18('rxForm.notes', '备注')">
                        <a-input :placeholder="$ti18('rxForm.notes', '备注','','input')" v-model="queryParam.Q_COMMENT__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.dataType','数据类型')">
                        <a-input :placeholder="i18n('form.dataType','数据类型','select')" v-model="queryParam.Q_DATA_TYPE__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.length','长度')">
                        <a-input-number :min="0" :max="1000000" :placeholder="i18n('form.length','长度','input')" v-model="queryParam.Q_LENGTH__I_EQ"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.decimalPlaces','小数位')">
                        <a-input-number :min="0" :max="1000000" :placeholder="i18n('form.decimalPlaces','小数位','input')" v-model="queryParam.Q_DECIMAL_LENGTH__I_EQ"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.controlType','控件类型')">
                        <a-input :placeholder="i18n('form.controlType','控件类型','select')" v-model="queryParam.Q_CONTROL__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.extendJson','扩展JSON')">
                        <a-input :placeholder="i18n('form.extendJson','扩展JSON','input')" v-model="queryParam.Q_EXT_JSON__S_LK"/>
					</a-form-item>
				  </a-col>
				  <a-col :md="5" :sm="15">
					<a-form-item :label="i18n('form.singlevalueornot','是否单字段')">
                        <a-input-number :min="0" :max="1000000" :placeholder="i18n('form.singlevalueornot','是否单字段','select')" v-model="queryParam.Q_IS_SINGLE__I_EQ"/>
					</a-form-item>
				  </a-col>
		  <template v-if="advanced">
			<!--TODO add advance search field here -->
          </template>

          <a-col :md="8" :sm="24">
            <span class="table-page-search-submitButtons">
              <a-button type="primary" @click="$refs.table.refresh(true)" icon="search">{{$ti18('rxList.searchBtn', '查询')}}</a-button>
              <a-button style="margin-left: 4px" @click="resetSearch">{{$ti18('rxList.resetBtn','重置')}}</a-button>
              <a @click="toggleAdvanced" style="margin-left: 8px">
                  {{ advanced ? $ti18('rxList.putAwayBtn','收起') : $ti18('rxList.openBtn','展开') }}
                  <a-icon :type="advanced ? 'up' : 'down'"/>
              </a>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <div class="table-operator">
      <a-button  type="primary" icon="plus" @click="handleAdd">{{$ti18('rxList.newBtn','新建')}}</a-button>
      <a-button v-if="editEnable && selectedRowKeys.length > 0" type="primary" icon="edit" @click="handleEditOne">{{$ti18('rxList.editBtn','编辑')}}</a-button>
      <a-dropdown v-if="removeEnable && selectedRowKeys.length > 0">
        <a-button type="danger" icon="delete" @click="delByIds(selectedRowKeys)">{{$ti18('rxList.delBtn','删除')}}</a-button>
      </a-dropdown>
      <span style="float:right">
         <a-button type="primary" shape="circle"  icon="sync" :size="small" @click="refreshGrid"></a-button>
         <a-button type="primary" shape="circle"  icon="search" :size="small" @click="toggleSearch"></a-button>
       </span>
    </div>
    <s-table
      size="default"
      ref="table"
      rowKey="id"
      :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
      :columns="columns"
      :data="loadData">
	 <span slot="serial" slot-scope="text, record, index">
		{{ index + 1 }}
	 </span>
      <span slot="action" slot-scope="text, record">
        <a v-if="editEnable" @click="handleEdit(record)">{{$ti18('rxList.editBtn','编辑')}}</a>
        <a-divider type="vertical" />
        <a v-if="removeEnable" @click="delByIds([record.id])">{{$ti18('rxList.delBtn','删除')}}</a>
      </span>
    </s-table>
    <formBoAttr-edit ref="modal" @ok="handleOk"/>
  </a-card>
</template>

<script>
  import FormBoAttrApi from '@/api/form/bo/formBoAttr'
  import FormBoAttrEdit from './FormBoAttrEdit'
  import {BaseList} from "@lowcode/jpaas-common-lib";
  export default {
    name: 'FormBoAttrList',
    mixins:[BaseList],
    components: {
      FormBoAttrEdit
    },
    data () {
      return {
        columns: [
          {title: '#',scopedSlots: { customRender: 'serial' },width: 30},
          { title: this.i18n('form.entityID','实体ID'),dataIndex: 'entId',width: 120 },
          { title: this.$ti18('rxForm.name', '名称'),dataIndex: 'name',width: 120 },
          { title: this.$comi18('business.fieldName', '字段名称'),dataIndex: 'fieldName',width: 120 },
          { title: this.$ti18('rxForm.notes', '备注'),dataIndex: 'comment',width: 120 },
          { title: this.i18n('form.dataType','数据类型'),dataIndex: 'dataType',width: 120 },
          { title: this.i18n('form.length','长度'),dataIndex: 'length',width: 120 },
          { title: this.i18n('form.decimalPlaces','小数位'),dataIndex: 'decimalLength',width: 120 },
          { title: this.i18n('form.controlType','控件类型'),dataIndex: 'control',width: 120 },
          { title: this.i18n('form.extendJson','扩展JSON'),dataIndex: 'extJson',width: 120 },
          { title: this.i18n('form.singlevalueornot','是否单字段'),dataIndex: 'isSingle',width: 120 },
          {title: this.$ti18('rxList.action','操作'), width: '220px', dataIndex: 'action', scopedSlots: {customRender: 'action'}}
        ],
        component:FormBoAttrEdit,
        comment:this.i18n('list.entityProper','业务实体属性'),
        widthHeight:['800px','600px']
      }
    },
      created() {
          this.needFilterAppId();
      },
    methods:{
        i18n(name,text,key){
            return this.$ti18(name,text,"formBoAttr",key);
        },
      delById(ids){
        return FormBoAttrApi.del({ ids: ids.join(',') });
      },
      getListByParams(parameter){
        return FormBoAttrApi.query(parameter)
      }
    }
  }
</script>
<style scoped>

</style>

